<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html lang="zh">
    <head>
        <title>售票审核系统-监控视频审核</title>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <link href="css/main.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="js/xmlhandler.js"></script>
        <script type="text/javascript">
            // localhost:8000/linecheck.html?id=%E7%B2%A4BAAAAA2014112102&line=c58
            var curhref = decodeURIComponent(window.location.href);
            var urlParameters = curhref.split("?")[1];
            var strArr = urlParameters.split("&");
            var idStr = strArr[0].split("=")[1];
            var line = strArr[1].split("=")[1];

            var xmlhttp = new XMLHttpRequest();
            // used to store number of stations
            var numberOfStations;

            // function to get the stations for a line and insert to the table.
            function createStationsTable(line) {
                if (line === "") {
                    alert("There is no line info.");
                    return false;
                } else {
                    var serverUrl = "server-script/createStationsTable.php?" + "line=" + line;
                    xmlhttp.onreadystatechange = function () {
                        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
                            if (xmlhttp.responseText === "NULL") {
                                var pInfo = "<p>无法从服务器拿到站点信息。<p>";
                                document.getElementById('downCountbox').innerHTML = pInfo;
                            } else {
                                var responseStrs = xmlhttp.responseText.split("|");
                                numberOfStations = responseStrs[0];
                                document.getElementById('downCountbox').innerHTML = responseStrs[1];
                            }
                        }
                    };
                    xmlhttp.open('GET', serverUrl, true);
                    xmlhttp.send();
                }
            }
        </script>
    </head>
    <body id="body">
        <div id="header">
            <h1><a href="/">欢迎进入售票审核系统</a></h1>
            <h3>监控视频审核</h3>
            <button class="btn btn-primary btn-large" type="button" onclick="window.history.back()">返 回</button>
            <hr/>
        </div>
        <div id="main">
            <div id="idp">
                <p><b>班次：</b></p>
            </div>
            <script type="text/javascript">
                document.getElementById('idp').innerHTML = "<p><b>班次：</b>" + idStr + "</p>";
            </script>
            <p>请查看监控视频，输入站点的<strong>上车</strong>和<strong>下车</strong>人数：</p>
            <div id="downCountbox">

            </div>
            <script>
                createStationsTable(line);
            </script>
            <div id="summitBtn">
                <br/>
                <button class="btn" onclick="submitCount()">提 交</button>
                <button class="btn" onclick="resetInput()">重 置</button>
            </div>
        </div>
        <div id="tempInfo">
        </div>
        <script>
            // funciton to submit the up and down count to server
            function submitCount() {
//                console.log("Number of Stations: " + numberOfStations);
                var sendData = "";
                var countStr = "";
                for (var i = 1; i <= numberOfStations; i++) {
                    var idU = 's' + i + 'u';
                    var idD = 's' + i + 'd';
                    if (i < numberOfStations) {
                        countStr += (document.getElementById(idU).value + ',' + document.getElementById(idD).value + '#');
                    } else {
                        countStr += (document.getElementById(idU).value + ',' + document.getElementById(idD).value);
                    }
                }

                var checkerName = window.prompt("请输入您的姓名：");
                while (!checkerName) {
                    if (checkerName === null) {
                        return false;
                    }
                    checkerName = window.prompt("请输入您的姓名：");
                }
//                console.log(checkerName);
                sendData = "line=" + line + '&' + "cid=" + idStr + '&' + "count=" + countStr + '&' + "checker=" + checkerName;
                if (window.confirm("确认提交？")) {
//                    console.log(sendData);
                    var serverUrl = "server-script/handleData.php";
                    xmlhttp.open('POST', serverUrl, true);
                    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                    xmlhttp.setRequestHeader("Connection", "close");
                    xmlhttp.onreadystatechange = function () {
                        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
                            document.getElementById('tempInfo').innerHTML = "";
                            if (xmlhttp.responseText === 'yes') {
                                var strInfo = "数据已处理完成\n是否查看结果？";
                                if (window.confirm(strInfo)) {
                                    var url = window.location.origin + "/linedetails/resultdetails.php?id=" + idStr;
                                    window.open(url, "_blank");
                                }
                            } else {
                                window.alert("提交数据有误，请检查后再次提交");
                            }
                        }
                    };
                    xmlhttp.send(sendData);
                    document.getElementById('tempInfo').innerHTML = "<p>数据已提交至服务器处理，请等待。。。</p>";
                }
            }

            // fucntion to reset all input value to 0
            function resetInput() {
                for (var i = 1; i <= numberOfStations; i++) {
                    var inputIdValueU = 's' + i + 'u';
                    var inputIdValueD = 's' + i + 'd';
                    document.getElementById(inputIdValueU).value = 0;
                    document.getElementById(inputIdValueD).value = 0;
                }
            }
        </script>
    </body>
</html>
